<style type="text/css">
    #hr-scoreIntegral-add {
        padding: 20px 25px 25px 0;
    }
</style>
<!-- 注意id属性每个页面id必须独立-->
<div class="layui-fluid" id="hr-scoreIntegral-add">
    <!--注意lay-filter属性，该属性为form表单唯一属性-->
    <form class="layui-form" action="" lay-filter="hr-scoreIntegral-add-form">
        <!-- layui-form-item为自适应长度样式 -->
        <!-- 表单页左侧label -->
        <!-- layui-input-block为整行宽度样式 -->
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">员工姓名</label>
            <div class="layui-input-block">
                <input type="text" name="staffId" id="cboTeacheryStaffName"
                       lay-filter="cboTeacheryStaffName" class="layui-input repetitive">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">成绩来源</label>
            <div class="layui-input-block">
                <input type="text" name="scoreDesc" id="cboTeacheryAdd"
                       lay-filter="cboTeacheryAdd" class="layui-input repetitive">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">积分类别</label>
            <div class="layui-input-block">
                <select name="type" id="hr-scoreIntegral-add-type" lay-filter="hr-scoreIntegral-add-type">
                    <option value="">请选择计分方式</option>
                    <option value = "1">课时积分</option>
                    <option value = "2">成绩积分</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">原始成绩</label>
            <div class="layui-input-block">
                <!-- minlength为最小长度、 maxlength为最大长度-->
                <!-- autocomplete默认填写off,此项为配置使用缓存读取历史记录-->
                <!-- lay-verify为表单验证属性：required：必填项、range于minlength，maxlength公用， character不能输入特殊字符-->
                <!-- 详细表单验证请参考：resources\static\febs\lay\modules\validate.js-->
                <input type="number" name="score" minlength="1" maxlength="20"
                       lay-verify="required|range|name|character"
                       autocomplete="off" class="layui-input repetitive" id="hr-scoreIntegral-add-score">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">实际得分</label>
            <div class="layui-input-block">
                <input type="number" minlength="1" maxlength="20"
                       lay-verify="required|range|name|character"
                       autocomplete="off" class="layui-input repetitive" id="hr-scoreIntegral-point"
                       readonly lay-filter="hr-scoreIntegral-point" name="point">
            </div>
        </div>
        <!-- 此页面为弹出页面，此处将本页面的提交按钮和重置按钮隐藏，使用febs-hide样式-->
        <div class="layui-form-item febs-hide">
            <!--lay-filter为按钮点击过滤器  注意id配置，为在父页面点击所获取的id-->
            <button class="layui-btn" lay-submit="" lay-filter="hr-scoreIntegral-add-submit"
                    id="hr-scoreIntegral-add-submit-btn"></button>
            <button type="reset" class="layui-btn" id="hr-scoreIntegral-add-reset-btn"></button>
        </div>
    </form>
</div>

<script type="text/javascript" src="module/treeSelect/treeSelect.js"></script>
<script>
    layui.use(['treeSelect', 'febs', 'form', 'validate','upload', 'dropdown'], function () {
        let $ = layui.$,
            febs = layui.febs,
            layer = layui.layer,
            //下拉框
            treeSelect = layui.treeSelect,
            dropdown = layui.dropdown,
            // 表单
            form = layui.form,
            // 验证
            validate = layui.validate;
        // 进行表单验证
        form.verify(validate);
        // 渲染表单
        form.render();
        // hr-scoreIntegral-add-submit 为上方提交按钮的过滤器名称
        form.on('submit(hr-scoreIntegral-add-submit)', function (data) {
            // data.field为当前form表单的josn数据
            let type = data.field.type;
            data.field.type = parseInt(data.field.type);
            febs.post(ctx + 'scoreIntegral/add', data.field, function (aa) {
                // 关闭所有弹出窗体
                layer.closeAll();
                // 弹出成功消息
                febs.alert.success('新增记录成功');
                // 点击父页面查询按钮
                $('#hr-scoreIntegral').find('#hr-scoreIntegral-query-btn').click();
            });
            return false;
        });

        $(function () {
            let score;
            let type;
            let sum;
            $("#hr-scoreIntegral-add-score").bind("input propertychange", function () {
                score = parseInt($("#hr-scoreIntegral-add-score").val());
                if (type == undefined) {
                    type = 0;
                }
                sum = score + type;
                document.getElementById("hr-scoreIntegral-point").value = sum;
            });

            form.on('select(hr-scoreIntegral-add-type)', function(data){
                type = parseInt(data.value);
                if (score == undefined) {
                    score = 0;
                }
                sum = score + type;
                document.getElementById("hr-scoreIntegral-point").value = sum;
            });
        })

        //构建成绩来源树
        treeSelect.render({
            // 选择器
            elem: '#cboTeacheryAdd',
            // 数据
            data: ctx + 'notice/userDeptTree',
            // 异步加载方式：get/post，默认get
            type: 'get',
            // 占位符
            placeholder: '请选择',
            // 是否开启搜索功能：true/false，默认false
            search: true,
            style: {
                folder: { // 父节点图标
                    enable: true // 是否开启：true/false
                },
                line: {
                    enable: true
                }
            },
            // 点击回调
            click: function (d) {
                console.log(d);
                $("#cboTeacheryAdd").val(d.current.id);
            },
            // 加载完成后的回调函数
            success: function (d) {

            }
        });

        //成绩来源下拉菜单
        $.ajax({
            type: 'get',
            url: ctx + 'user/selectUserlist',
            cache: false,
            success: function (res) {
                let userArray = res.data.rows;
                if (userArray.length > 0) {
                    for (let i = 0; i < userArray.length; i++) {
                        let user = userArray[i];
                        $("#cboTeacheryAdd").append("<option value='" + user.userId + "'>" + user.username + "</option>");
                    }
                }
                //选中后传值，进行查询
                // layui.form.render("select");
                // $.ajax({
                //     type: 'get',
                //     url: 'notice/findCreateUserId',
                //     success: function (res) {
                //         console.log(res);
                //         $("#cboTeacheryAdd").val(res.data);
                //         layui.form.render("select");
                //     }
                // })
            }
        });

        //构建用户姓名树
        treeSelect.render({
            // 选择器
            elem: '#cboTeacheryStaffName',
            // 数据
            data: ctx + 'notice/userDeptTree',
            // 异步加载方式：get/post，默认get
            type: 'get',
            // 占位符
            placeholder: '请选择',
            // 是否开启搜索功能：true/false，默认false
            search: true,
            style: {
                folder: { // 父节点图标
                    enable: true // 是否开启：true/false
                },
                line: {
                    enable: true
                }
            },
            // 点击回调
            click: function (d) {
                console.log(d);
                $("#cboTeacheryStaffName").val(d.current.id);
            },
            // 加载完成后的回调函数
            success: function (d) {

            }
        });

        //用户姓名下拉菜单
        $.ajax({
            type: 'get',
            url: ctx + 'user/selectUserlist',
            cache: false,
            success: function (res) {
                let userArray = res.data.rows;
                if (userArray.length > 0) {
                    for (let i = 0; i < userArray.length; i++) {
                        let user = userArray[i];
                        $("#cboTeacheryStaffName").append("<option value='" + user.userId + "'>" + user.username + "</option>");
                    }
                }
                //选中后传值，进行查询
                // layui.form.render("select");
                // $.ajax({
                //     type: 'get',
                //     url: 'notice/findCreateUserId',
                //     success: function (res) {
                //         console.log(res);
                //         $("#cboTeacheryStaffName").val(res.data);
                //         layui.form.render("select");
                //     }
                // })
            }
        });

        //积分下拉框
        dropdown.render({
            elem: '#layui-input repetitive' //可绑定在任意元素中，此处以上述按钮为例
            ,data: [{
                title: 'menu item 1'
                ,id: 100
            },{
                title: 'menu item 2'
                ,id: 101
            }]
            //菜单被点击的事件
            ,click: function(obj){
                console.log(obj);
                layer.msg('回调返回的参数已显示再控制台');
            }
        });

    });
</script>